<div class="uk-layui-form">
    <form class="layui-form" method="post" action="/apps/report/design/update.html"  enctype="multipart/form-data" >
    	<input type="hidden" name="id" value="${report.id!''}">
    	<div class="layui-tab">
		  <ul class="layui-tab-title">
		    <li class="layui-this">报表信息</li>
		   <!--  <li>用户管理</li> -->
		   
		  </ul>
		  <div class="layui-tab-content">
		    <div class="layui-tab-item layui-show">
		      	<div class="layui-form-item" style="margin-top:20px;">
		            <div class="layui-inline">
		                <label class="layui-form-label">标题：</label>
		                <div class="layui-input-inline" style="width: 600px;">
		                    <input type="text" maxlength="200" name="name" required value="${report.name!''}" lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
		                </div>
		            </div>
		            
		        </div>
		        
		        <div class="layui-form-item" style="margin-top:20px;">
		            <label class="layui-form-label">启用投屏：</label>
				      <div class="layui-input-inline" style="width: 300px;">
				        <input type="checkbox" name="screen" lay-skin="switch" value="1" lay-text="是|否" <#if report.screen == true>checked="checked"</#if>>
				      </div>
				      
				     <label class="layui-form-label">禁止滚动：</label>
				      <div class="layui-input-inline" >
				        <input type="checkbox" name="norolling" lay-skin="switch" value="1" lay-text="是|否" <#if report.norolling == true>checked="checked"</#if>>
				      </div>
		        </div>
		        
		        <div class="layui-form-item" style="margin-top:20px;">
		            <label class="layui-form-label">颜色：</label>
				      <div class="layui-input-inline" style="width: 300px;">
				        <input type="text" value="${report.bgcolor!''}" name="bgcolor" placeholder="请选择颜色" class="layui-input" id="test-form-input">
				      </div>
				      <div class="layui-inline" style="left: -11px;">
				        <div id="test-form"></div>
				      </div>
		        </div>
		        
		        <div class="layui-form-item" style="margin-top:20px;position: relative;">
		            <label class="layui-form-label">背景：</label>
					<div class="layui-input-block">
							<div class="layui-box layui-upload-button">
								<input type="file" name="img" accept="image/gif, image/jpeg, image/png" lay-ext="jpg|png|gif"  class="layui-upload-file" onchange="$('#logo_img').html($(this).val());"/>
								<span class="layui-upload-icon"><i class="layui-icon"></i>上传图片</span>
							</div>
						</div>
					<div id="logo_img" style="position:absolute;left: 230px;top:15px;"></div>	
		        </div>
		    </div>
		    
		    <!-- 页签分界线 -->
		    <!-- <div class="layui-tab-item">内容2</div> -->
		  </div>
		</div>
		
		
		<div class="layui-form-button">
            <div class="layui-button-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button></div>
        </div>
    </form>
</div>
<script>
//Demo
layui.use('form', function(){
  var form = layui.form;
  form.render(); //更新全部
});

layui.use('colorpicker', function(){
	  var $ = layui.$
	  ,colorpicker = layui.colorpicker;
	  
	  
	  //颜色选择器
	  colorpicker.render({
	    elem: '#test-form'
	    ,color: '${report.bgcolor!''}'
	    ,done: function(color){
	      $('#test-form-input').val(color);
	    }
	  });
	  
});

</script>

<SCRIPT type="text/javascript">
	var setting = {
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			onClick: onClick
		}
	};
	
	function onClick(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("dataDicTree"),
		nodes = zTree.getSelectedNodes(),
		v = "" , value = "";
		nodes.sort(function compare(a,b){return a.id-b.id;});
		for (var i=0, l=nodes.length; i<l; i++) {
			v += nodes[i].name + ",";
			if(value != ""){
				value = value + "," ;
			}
			value = nodes[i].id ;
		}
		if (v.length > 0 ) v = v.substring(0, v.length-1);
		$("#dicname").attr("value", v);
		$("#dicid").attr("value", value);
		hideMenu();
	}


	var zNodes =[
	             { id:'0', pId:'0', name:"报表分类", open:true }
	             <#if dataDicList??>
	             <#list dataDicList as dataDic>
	             ,{ id:'${dataDic.id!''}', pId:'${dataDic.parentid!''}', name:"${dataDic.name!''}", open:true }
	             </#list>
	             </#if>
	         ];
	$(document).ready(function(){
		var ztree = $.fn.zTree.init($("#dataDicTree"), setting, zNodes);
		<#if dataDic??>
		var node = ztree.getNodeByParam('id', '${dataDic.id!''}');//获取id为1的点  
		ztree.selectNode(node);//选择点  
		<#else>
		var node = ztree.getNodeByParam('id', '0');//获取id为1的点  
		ztree.selectNode(node);//选择点
		</#if>
	});
	function showMenu() {
		$("#menuContent").css({left:"0px", top:"38px"}).show();

		$("body").bind("mousedown", onBodyDown);
	}
	function hideMenu() {
		$("#menuContent").hide();
		$("body").unbind("mousedown", onBodyDown);
	}
	function onBodyDown(event) {
		if (!(event.target.id == "menuBtn" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {
			hideMenu();
		}
	}

</SCRIPT>